<template>
	<view>
		<view style="height: 35px; background-color: #FED501;"></view>
		<view class="">
			<view class="">
				<view class="mineTop">
					<!-- 头像 -->
					<image src="https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=4255547098,2077529314&fm=11&gp=0.jpg" mode=""></image>
					<view class="">
						<view class="">
							清酒
						</view>
						<view class="">
							简介：有只狗狗
						</view>
					</view>
				</view>
				<view class="line">
				</view>
				<view class="comShare">
					<view class="">
						<text>发布</text>
						<!-- <text>{{  }}</text> -->
						<text>152</text>
					</view>
					<view class="">
						<text>关注</text>
						<text>24</text>
					</view>
					<view class="">
						<text>粉丝</text>
						<text>1532</text>
					</view>
				</view>
			</view>
		</view>
		<view class="">
			<view class="mineList" v-for="(items, index) in comAdmin" :key="index">
				<view class="viewLine">
				</view>
				<view class="">
					{{ items.name }}
				</view>
				<view class="line">
				</view>
				<view class="viewCommunity">
					<navigator :url="item.path" v-for="(item, index) in items.class" :key="index" class="viewCom" @click="classify">
						<image :src="item.url" mode="aspectFit"></image>
						<text>{{ item.content }}</text>
					</navigator>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userName: this.$store.state.user.userName,
				password: this.$store.state.user.password,
				comAdmin: [
					{
						name: "社区管理",
						class: [
							{
								id: 0,
								content: "宠物",
								url: "../../static/images/mine/four.png",
								path: ""
							},{
								id: 1,
								content: "内容收藏",
								url: "../../static/images/mine/one.png",
								path: ""
							},{
								id: 2,
								content: "宠物星球",
								url: "../../static/images/mine/two.png",
								path: ""
							},{
								id: 3,
								content: "等级",
								url: "../../static/images/mine/twenty.png",
								path: ""
							},{
								id: 4,
								content: "点赞",
								url: "../../static/images/mine/five.png",
								path: ""
							}
						]
					},
					{
						name: "商城管理",
						class: [
							{
								id: 0,
								content: "购物车",
								url: "../../static/images/mine/six.png",
								path: ""
							},{
								id: 1,
								content: "订单",
								url: "../../static/images/mine/seven.png",
								path: ""
							},{
								id: 2,
								content: "物流",
								url: "../../static/images/mine/eight.png",
								path: ""
							},{
								id: 3,
								content: "卡券包",
								url: "../../static/images/mine/nine.png",
								path: ""
							},{
								id: 4,
								content: "商品收藏",
								url: "../../static/images/mine/ten.png",
								path: ""
							},{
								id: 5,
								content: "浏览历史",
								url: "../../static/images/mine/eleven.png",
								path: ""
							},{
								id: 6,
								content: "退款",
								url: "../../static/images/mine/twelve.png",
								path: ""
							},{
								id: 7,
								content: "评价",
								url: "../../static/images/mine/thirteen.png",
								path: ""
							},{
								id: 8,
								content: "收货地址",
								url: "../../static/images/mine/fifteen.png",
								path: ""
							}
						]
					},
					{
						name: "其它",
						class: [
							{
								id: 0,
								content: "皮肤",
								url: "../../static/images/mine/sixteen.png",
								path: ""
							},{
								id: 1,
								content: "建议",
								url: "../../static/images/mine/seventeen.png",
								path: ""
							},{
								id: 2,
								content: "客服",
								url: "../../static/images/mine/eighteen.png",
								path: ""
							},{
								id: 3,
								content: "设置",
								url: "../../static/images/mine/nineteen.png",
								path: "/pages/set/set"
							}
						]
					}
				],
			}
		},
		methods: {
			login() {
				uni.navigateTo({
					url:"/pages/login/login"
				})
			}
		}
	}
</script>

<style>
/* 头像 */
.mineTop {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	padding-bottom: 10px;
	padding-top: 8px;
	background-color: #FED501;
	color: #FFFFFF;
}
.mineTop > image {
	width: 80px;
	height: 80px;
	border-radius: 999px;
	margin-right: 8px;
	margin-left: 8px;
}
.comShare {
	display: flex;
	justify-content: space-between;
	text-align: center;
	margin-top: 16rpx;
}
.comShare > view {
	width: 33%;
	display: flex;
	flex-flow: column wrap;
}
.comShare uni-image {
	width: 40rpx;
	height: 40rpx;
}
/* 导航 */
.mineList > view:not(:nth-of-type(1)) {
	margin: 8px;
}
.mineList > view:nth-of-type(2) {
	font-size: 18px;
}
.viewLine {
	width: 100%;
	height: 20rpx;
	background-color: #e8e8e8;
}
/* 顶部导航 */
.viewCommunity {
	margin: 16rpx;
	display: flex;
	flex-flow: row wrap;
	/* justify-content: space-around; */
}
.viewCommunity > view {
	text-align: center;
}
.viewCommunity uni-image {
	width: 100rpx;
	height: 100rpx;
}
.viewCom {
	width: 20%;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.viewCom > text {
	font-size: 24rpx;
	margin-top: 10rpx;
	margin-bottom: 10rpx;
}
.line {
	/* width: 100%; */
	height: 2rpx;
	background-color: #e8e8e8;
}
</style>
